<style>
    .mainbar2{
        width: 800px;
        margin: 0 auto;
        margin-top: 50px;
        border: 1px solid #999999;
        border-radius: 10px;
        box-shadow: 4px 4px 4px #666666;
    }
    .img{
        width: 100%;
        height: 398px;
    }
    .point{
        width: 1000px;
        border: 1px dashed black;
        margin: 50px auto;
    }
    .before{
        float: left;
    }
    .later{
        float: right;
    }
    .comment{
        width: 1000px;
        margin: 0 auto;
    }
    .comment_show{
        width: 1000px;
        height: 400px;
        margin: 50px auto;
        border: solid 1px #d9d9d9;
        overflow: hidden;
        border-radius: 5px;
    }
    .co span{
        margin-left: 100px;
    }
    .co-show{
        width: 800px;
        height: 50px;
        border: dashed 1px #d9d9d9;
        margin:0 auto;
        padding: 10px;
    }
</style>

<div class="mainbar2">
    <img class="img" src="URLPath{$blog.url}"  alt="image" />
    <p style="font-weight: 800;text-align: center;font-size: 16px" >{$blog.title}</p>
    <p>{$blog.content|htmlspecialchars_decode}</p>
    <span>阅读<span style="color: red">（{$blog.read_times}</span>  评论(50)</span>
</div>
<div class="point">
    <div class="before">前一篇：xxxxxxxxxxxxxxx</div>
    <div class="later">后一篇：xxxxxxxxxxxxxxxx</div>
</div>
<!--评论-->
<div class="comment">
    <h4>发表你的评论</h4>
    <form action="__URL__/comment" method="post">
        <input type="hidden" name="article_id" value="{$blog.id}">
        <div>
            <!-- 加载编辑器的容器 -->
            <label for="container">评论 (required)</label>
            <script id="container" name="content" type="text/plain">
            </script>
        </div>
        <!-- 配置文件 -->
        <script type="text/javascript"
                src="/thinkphp/Public/ueditor1_4_3_3-utf8-php/utf8-php/ueditor.config.js"></script>
        <!-- 编辑器源码文件 -->
        <script type="text/javascript"
                src="/thinkphp/Public/ueditor1_4_3_3-utf8-php/utf8-php/ueditor.all.js"></script>
        <!-- 实例化编辑器 -->
        <script type="text/javascript">
            var ue = UE.getEditor('container', {
                initialFrameHeight: 200,            //设置默认的高度,
                toolbars: [
                    ['fullscreen', 'source', 'undo', 'redo'],
                    ['bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc']
                ]
            });
        </script>
        <input type="image" name="imageField" id="imageField" src="IMAGEPath/submit.gif" class="send1" style="margin-top: 20px;margin-left: 457px"/>
    </form>
</div>
<!---评论区-->
<div class="comment_show">
    <h3 style="text-align: center">评论区</h3>
    <volist name="lists" id="row">
        <div class="co">
            <span>{$row.create_at|date="Y-m-d:H:i:s",###}&nbsp;&nbsp;|&nbsp;&nbsp;{$row.username}</span>
            <div class="co-show">
                {$row.content|htmlspecialchars_decode}
            </div>
        </div>
    </volist>

    <!--<volist name="lists" id="row">-->
        <!--<li>{$row.username}{$row.content|htmlspecialchars_decode}</li>-->
    <!--</volist>-->
</div>

<script type="text/javascript" src="JSPath/jquery-1.11.3.js"></script>
<script>
    $("#imageField").click(function(e){
        e.preventDefault();

        var v =$(container).val();
//        alert('aa');
        $.ajax('__CONTROLLER__/comment',{
                type:'post',
                data:{
                    content:ue.getContent(),
                    article_id:{$blog.id}
            },
            dataType:'json',
            success:function (data) {
            console.log(data);
            if (data.status==1){
                $(".comment_show").append(data.str);
            } else {
                alert(data.msg);
            }
        }
//        return false;
    })
    });

</script>